<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div>
    <input type="text" placeholder="请输入手机号" id="phone">
    <input type="text" placeholder="">
    <button id="myButton" onclick="doSendCode()">发送验证码</button>
</div>

</body>
<script>
    /*
    * 1\常量 变量\数据类型
    * 2、函数
    * 3、参数
    * 4、匿名函数
    * 5、自执行函数。
    * 6、js操作DOM（目前都被jquery替代了）
    * setTimeOut
    *
    * PS:js里面，同一名字的变量只会在内存里记录一次，后面的会把前期的覆盖掉
    * ps:js变量分为全局变量和局部变量，
    *   1、全局变量在任何位置都可以访问
    *   2、局部变量只能在对应代码块里或者其子函数里访问
    *   3、函数的职责问题，
    *       1）直接上手干，然后慢慢优化代码。
    *       2) 写代码前，先来波设计sad
    *
    * */
    var name="123";
    var number=123;
    function fName(str,str2,str3){
        // alert("str==>"+str+"==str2==>"+str2+"==str3==>"+str3)
        alert(JSON.stringify(arguments)); //js查找函数是通过函数名来找的，与参数没关系
    }
    // // fName();
    // // fName(1);
    // fName(1,2,3,4);
    fName=123;
    var fName2=function(){
        alert("I am 匿名函数")
    }

    // alert(fName)
    /*延时函数*/
    /*setTimeout(fName2,1000)
    setTimeout(function(){
        alert(1)
    },1000);*/
    /*定时器*/
    var intervalIndex=10;
    var canSendFlag=true; //标记位

    function countDown() {
        canSendFlag=false;
        intervalIndex=10;
        var myInterval=setInterval(function () {
            intervalIndex--;
            if(intervalIndex==0){
                clearInterval(myInterval);
                canSendFlag=true;
                document.getElementById("myButton").innerHTML="点击发送验证码";
            }else{
                document.getElementById("myButton").innerHTML=intervalIndex+"s";

            }
            // console.log("intervalIndex==>"+intervalIndex)
        },1000)
    }
    /*发送验证码的点击事件*/
    function doSendCode() {
        console.log("doSendCode==>"+canSendFlag)
        if(canSendFlag){
            if(document.getElementById("phone").value.length==11){
                dosendAjax("1111",function(data) {
                    countDown()
                },function (data) {
                    alert(data)
                })
            }else{
                alert("手机号格式不对")
            }
            //
        }
    }
//  往后台发送请求
    function dosendAjax(data,succback,errback) {
        if(data=="1111"){
            succback();
        }else{
            errback("我心情不好，今天不发验证码")
        }
    }
</script>
</html>